<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <title>Document</title>
    </head>

    <body>
        <form action="" id="form" name="submit">
            <input type="text" name="user" placeholder="账号" /><br />
            <input type="text" name="pwd" placeholder="密码" /><br />
            <input type="text" name="pwd1" placeholder="确认密码" /><br />
            <input type="text" name="phone" placeholder="手机号" /><br />
            <input type="button" value="提交" id="btn" />
        </form>

        <script>
            function Tactics() {}
            Tactics.prototype.rules = {
                userL: function (value) {
                    return value !== "";
                },
                posswrod: function (value, length) {
                    //密码
                    //密码的长度必须大于等于value的长度
                    return value.length >= length;
                },
                solo: function (value, mi) {
                    //再次确认密码
                    return value === mi;
                },
                phone: function (value) {
                    //验证手机号
                    // console.log(value,'3');
                    let reg = /^1[3-9]\d{9}$/;
                    return reg.test(value);
                },
            };
            Tactics.prototype.fun = function (obj) {
                let errMag = null;
                for (let val in obj) {
                    for (let item of obj[val]) {
                        let value = item.value;
                        if (!Array.isArray(value)) {
                            value = [value];
                        }
                        let flag = this.rules[item.rule].apply(this, value);
                        if (!flag) {
                            errMag = {
                                code: `${val}.${item.rule}`,
                                message: item.message,
                            };
                            break;
                        }
                    }
                    if (errMag) {
                        break;
                    }
                }
                return errMag;
            };

            let Tacticss = new Tactics();
            btn.onclick = function () {
                let res = Tacticss.fun({
                    user: [
                        {
                            rule: "userL",
                            value: form.user.value,
                            message: "账号不能为空",
                        },
                    ],
                    pwd: [
                        {
                            rule: "posswrod",
                            value: [form.pwd.value, 6],
                            message: "最小长度为6",
                        },
                    ],
                    solo: [
                        {
                            rule: "solo",
                            value: [form.pwd.value, form.pwd1.value],
                            message: "俩次输入密码不对",
                        },
                    ],
                    phone: [
                        {
                            rule: "phone",
                            value: form.phone.value,
                            message: "请填写正确的手机号",
                        },
                    ],
                });
                console.log(res, "res");
            };
        </script>
    </body>
</html>
